<!-- toaster directive -->
<toaster-container
        toaster-options="{'position-class': 'toast-top-right', 'close-button':true}"></toaster-container>
<!-- / toaster directive -->
<!-- 导航条 -->
<div class="bg-white bread-crumb">
    <ul class="breadcrumb b-a m-b-n-xs lter b-b wrapper-md">
        <li><a ui-sref="main"><i class="glyphicon glyphicon-user"></i>  统计报表</a></li>
        <li><a ui-sref="main" class="active" ng-bind="title"></a></li>
    </ul>
</div>


<!-- 加载提醒 -->
<div ng-show="loading" class="text-center m-t-md text-lg dataWarn"><i class="fa fa-spin fa-spinner"></i> 数据加载中...</div>

<style scoped>
    .content{margin-top: 70px;}
    .sex,.nation,.age,.province{width:47%;margin: 0 0 2% 2%;float: left;border:1px solid #c2bdbf;position: relative;}
    .sexReport,.nationReport,.ageReport,.provinceReport{ width:100%;height: 260px;}
    .ageReport,.provinceReport{height: 330px;}
</style>
<!-- 内容区域 -->
<div ng-hide="loading" class=" content">
    <!--性别统计-->
    <div class="sex">
        <div id="sexReport" class="sexReport">

        </div>
    </div>
    <!--民族统计-->
    <div class="nation" >
        <div class="nationReport"id="nationReport">

        </div>
    </div>
    <!--年龄统计-->
    <div class="age">
        <div class="ageReport"id="ageReport" ></div>
    </div>
    <!--省市统计-->
    <div class="province">
            <div class="provinceReport" id="provinceReport"></div>
    </div>

</div>
